<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .c1 {
            color: #FFA500;
        }

        .c2 {
            font-size: 50px;
        }
    </style>
</head>
<body>

<p>hello</p>
<input type="text" id="text">
<script>

    var elements = document.getElementsByTagName('p');
    // className  只有一个class生效
    // elements[0].className = 'c1 c2'
    // elements[0].className = 'c1'
    // elements[0].className = 'c2'

    // classList  可以实现样式叠加
    elements[0].classList.add('c1')
    elements[0].classList.add('c2')

    elements[0].classList.remove('c1')
    elements[0].classList.remove('c2')

    var text = document.getElementById('text');



</script>
</body>
</html>